/**
 * Created by mar105 on 2019-02-27.
 */
/* eslint-disable object-curly-newline,prefer-destructuring */
import React, { Component } from 'react';
import { Form, Row, Col, Icon } from 'antd';
import ShowType from './CommonComponent';
import styles from '../../index.less';
import * as commonUtils from '../../utils/utils'; /* 通用方法 */

const FormItem = Form.Item;

export default class CommonView extends Component {
  shouldComponentUpdate(nextProps) {
    const { masterData, expandView } = this.props;
    return JSON.stringify(masterData) !== JSON.stringify(nextProps.masterData) || expandView !== nextProps.expandView;
  }

  handleToggle = () => {
    const { expandView } = this.props;
    this.props.onSaveState({ expandView: !expandView });
  };

  render() {
    const { masterConfig, expandView, sModelsId, enabled } = this.props;
    let { masterData } = this.props;
    masterData = masterData === undefined ? {} : masterData;
    const masterShowConfig = commonUtils.isNotEmptyObject(masterConfig) ? masterConfig.gdsconfigformslave.filter(item => item.bVisible && item.sName !== '') : [];
    const formItemLayout = { labelCol: { span: 2 }, wrapperCol: { span: 18 } };
    return (
      <FormItem className={styles.searchMainForm}>
        <Row id="saleAddForm" type="flex" style={{ height: expandView ? 'auto' : '100px', overflow: 'hidden' }}>
          {
            masterShowConfig.map((child) => {
              const sMemo = child.sName.toLowerCase().endsWith('memo');
              const iColValue = sMemo ? 21 : child.iColValue * 6; /* 跨度 */
              const iOrder = sMemo ? 100 : child.iOrder > 100 ? 100 : child.iOrder; /* 排序 */
              let enabledNew = (enabled && !child.bReadonly && !child.specialControl);
              if (child.iTag === 1) {
                enabledNew = false;
              } else if (child.iTag === 3) {
                enabledNew = true;
              }
              const showTypeProps = {
                name: 'master',
                form: this.props.form,
                formId: sModelsId,
                getSqlDropDownData: this.props.getSqlDropDownData,
                handleSqlDropDownNewRecord: this.props.handleSqlDropDownNewRecord,
                getFloatNum: this.props.getFloatNum,
                getDateFormat: this.props.getDateFormat,
                onChange: this.props.onChange,
                showConfig: child,
                formItemLayout: sMemo ? formItemLayout : {},
                textArea: sMemo,
                enabled: enabledNew,
                dataValue: masterData[child.sName],
                bTable: false,
              };
              return (
                <Col key={child.sId} span={iColValue} order={iOrder}>
                  <ShowType {...showTypeProps} />
                </Col>
              );
            })
          }
        </Row>
        <button
          className={expandView ? styles.collapseB : styles.collapseA}
          onClick={this.handleToggle}
        >
          <span>{expandView ? '缩略展示' : '显示全部'}</span><Icon type={expandView ? 'up' : 'down'} />
        </button>
      </FormItem>
    );
  }
}
